<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8"/>
    <title>Spark Authing 登录</title>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="icon" th:href="@{/images/logo.png}"/>
    <link rel="stylesheet" type="text/css" th:href="@{/css/style.css}" media="all">
    <link rel="stylesheet" type="text/css" th:href="@{/css/iconfont.css}" media="all">
    <link rel="stylesheet" th:href="@{/css/message.css}">
</head>
<body>
<input type="hidden" id="contextPath" name="contextPath" th:value="${#request.getContextPath()}">
<div class="dowebok" id="dowebok">
    <div class="form-container sign-up-container">
        <form action="#">
            <h1 style="font-size: 20px;">欢迎加入Spark Authing</h1>
            <span>填写个人信息</span>
            <input type="text" id="tenant" name="tenant" placeholder="领域池编码">
            <input type="text" id="account" name="account" placeholder="账号">
            <input type="email" placeholder="电子邮箱">
            <input type="password" placeholder="密码">
            <button>注册</button>
        </form>
    </div>
    <div class="form-container sign-in-container">
        <form action="/authentication/form" method="post">
            <h1 style="font-size: 20px;">Spark Authing 登录</h1>
            <div class="social-container">
                <a href="#" class="social"><span class="iconfont">&#xe64c;</span></a>
                <a href="#" class="social"><span class="iconfont">&#xe709;</span></a>
                <a href="#" class="social"><span class="iconfont">&#xe61a;</span></a>
            </div>
            <span>或使用您的帐号</span>
            <input type="text" id="tenantCode" name="tenantCode" placeholder="领域池编码">
            <input type="text" id="username" name="username" placeholder="账户">
            <input type="password" id="password" name="password" placeholder="密码">
            <a href="#">忘记密码？</a>
            <button id="login" type="submit">登录</button>
        </form>
    </div>
    <div class="overlay-container">
        <div class="overlay">
            <div class="overlay-panel overlay-left">
                <h1>已有帐号？</h1>
                <p>请使用您的帐号进行登录</p>
                <button class="ghost" id="signIn">登录</button>
            </div>
            <div class="overlay-panel overlay-right">
                <h1>没有帐号？</h1>
                <p>立即注册加入我们，和我们一起开始旅程吧</p>
                <button class="ghost" id="signUp">注册</button>
            </div>
        </div>
    </div>
</div>
<script th:src="@{/jquery/jquery.min.js}"></script>
<script th:src="@{/js/message.js}"></script>
<script th:src="@{/js/index.js}" charset="utf-8"></script>
<script type="text/javascript" th:src="@{/js/loadingAjax.js}"></script>
<script>
    $(document).ready(function () {
        const contextPath = $("#contextPath").val();
        $("#tenantCodeMsg").hide()
        $('#login').click(function (e) {
            // 校验领域池信息
            const url = contextPath + '/oauth/checkTenant';
            const tenantCode = $("#tenantCode").val()
            const param = 'tenantCode=' + tenantCode;
            const responseData = loadingAjaxJsonData('get', url, param);
            if (responseData.code !== 200) {
                Qmsg.error({
                    content: "领域池不存在，请检查！",
                    timeout: 3000
                });
                return false;
            }
            return true
        });
    });
</script>
</body>

</html>
